import React, { Component } from 'react';
import './zxsl.scss';
import { Link } from 'react-router-dom'
class Com extends Component {
    constructor (props) {
      super(props)
      this.state = {
          zxsllist:[]
      }
    }
    componentDidMount () {
        fetch('http://poem.daxunxun.com:8000/api/juzi')
        .then(res => res.json())
        .then(data => {
          this.setState({
            zxsllist:data
            
          })
        })
    }
  
    render () {
      return (
        <div className = "zuixinsl">
            <div className = "zxsltop"></div>
            <div className = "zxslcont">
                <h2>精选诗句</h2>
                <ul>
                    {
                      this.state.zxsllist.map((item,index)=>{
                          return(
                              <li key={index}> 
                                 <Link to="./../../mingju">{item.mingju}</Link>
                                <span><Link to="./../../mingju">{item.name}</Link></span>
                              </li>
                          )
                      })
                    }
                </ul>
            </div>
            <div className = "zxslbon"></div>
        </div>
      )
    }
  }
  
  export default Com;